<template>
  <div>
    <mt-cell title="停车场" :value="sessionData.plName"></mt-cell>
    <mt-cell title="卡类型" :value="sessionData.cardTypeStr"></mt-cell>
    <mt-cell title="绑定车牌" :value="sessionData.carNumber"></mt-cell>
    <mt-cell title="生效时间" :value="sessionData.validStartTime | formatDate"></mt-cell>
    <mt-cell title="有效期至" :value="sessionData.validEndTime | formatDate"></mt-cell>
    <mt-cell title="购买数量" :value="sessionData.buyNum"></mt-cell>
    <mt-cell title="单价" :value="((sessionData.price)/100).toFixed(2)"></mt-cell>
    <mt-cell title="总金额" :value="((sessionData.totalFee)/100).toFixed(2)"></mt-cell>
    <mt-cell title="优惠金额" :value="((sessionData.discountFee)/100).toFixed(2)"></mt-cell>


    <mt-cell title="应付金额">
      <span style="color: red">{{((sessionData.actFee)/100).toFixed(2)}}</span>
    </mt-cell>

    <div style="text-align: center;margin-top: 20px;">
      <input type="checkbox" v-model="agreeCheckbox"><span>我已阅读并同意</span><span style="color: #3885D9;cursor: pointer" @click="agreeShowHandle">《购买协议》</span>

    </div>

    <div class="submit-box" @click="buyCardBtn">
      去支付
    </div>
    <div class="agree-wrap" v-show="agreeShow">
      <div class="agree-box">
        <div class="agree-main" ><p class="MsoNormal" align="center" style="text-align:center;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:12.0000pt;mso-font-kerning:1.0000pt;"><o:p>&nbsp;</o:p></span></b></p><p class="MsoNormal" align="center" style="text-align:center;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:12.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">关于四川营临时停车场停车协议</font></span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:12.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" align="center" style="text-align:center;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:12.0000pt;mso-font-kerning:1.0000pt;"><o:p>&nbsp;</o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">甲方：北京西荣通顺投资管理有限公司</font></span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">地址：北京市西城区西绦胡同</font>7号院</span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">联系人：张凯</font></span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">电话：</font>010-66020580</span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p>&nbsp;</o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">乙方：{{sessionData.custName}}</font></span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">住址：{{sessionData.addressStr}}</font></span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">电话：{{sessionData.phoneNum}}</font></span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.1000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">车牌号</font>:{{sessionData.carNumber}}</span></b><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></b></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">鉴于：</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">1、甲方对四川营临时停车场有管理权限，目的为缓解居民停车困难。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">2、甲方同意乙方按照本协议约定停放车牌号码为</span><b><span style="mso-spacerun:'yes';font-family:仿宋;font-weight:bold;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">{{sessionData.carNumber}}</font>&nbsp;</span></b><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">车辆，非经甲方书面同意乙方不得停放其他车辆。</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">经双方友好协商，订立协议如下：</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">一、甲方的权利和义务：</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">1、甲方按照双方约定向乙方收取停车费。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">2、甲方有权管理停车泊位，本协议项下停车场只限于停车，乙方不得挪作他用。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">3、若发生人为恶意损坏乙方车辆，并给乙方造成损失的情况，甲方可协助乙方进行追查，由责任人依照有关法律规定进行赔偿。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">4、乙方在停车场停放车辆时，如不服从现场管理的，甲方有权解除本协议。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">二、乙方的权利和义务：</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">1、乙方应按照本协议约定，按时足额缴纳停车费。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">2、乙方缴纳完双方约定的费用后，有权索要停车泊位停放车辆的停车费发票。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">3、乙方有权对甲方提供的服务进行监督，提出建议。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">4、乙方应服从甲方收费管理人员的指挥和疏导。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">5、乙方所停车辆应锁好车门，关好车窗，把车内物品随身带走。如因乙方车门没锁、车窗没关或车内存放物品等引发车辆被砸、物品丢失等问题，由乙方自行承担损失，并由责任人赔偿，甲方不承担责任。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">6、乙方应遵守停车场的管理和规章制度。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">7、乙方不得在停车泊位设置障碍，不得争抢停车泊位。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">8、如果乙方在本协议期间，不再符合“四证合一”或“三证合一”</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:32"><font face="仿宋">资格</font></ins></span></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">的，不再享受优惠停车，本协议</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:31"><font face="仿宋">自</font>“四证合一”或“三证合一”资格丧失之日起</ins></span></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">自动</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:32"><font face="仿宋">终止</font></ins></span></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">。</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">三、停车费价格及收费办法</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">1、停车服务费价格按照甲乙双方协议收费：</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;&nbsp;<font face="仿宋">缴费方式</font>&nbsp;☑季付；&nbsp;□半年付；&nbsp;□年付；共计&nbsp;1&nbsp;辆车，每月价格&nbsp;360&nbsp;元，年共计4320&nbsp;元，此次缴纳&nbsp;&nbsp;元，其余费用按缴费方式准时进行缴费。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:35"><font face="仿宋">乙方应在每个付款周期开始前</font>20日内完成当期停车费预缴付。</ins></span></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">四、本协议履行期为</font></span><u><span style="mso-spacerun:'yes';font-family:仿宋;text-decoration:underline;text-underline:single;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;</span></u><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;<font face="仿宋">年</font></span><u><span style="mso-spacerun:'yes';font-family:仿宋;text-decoration:underline;text-underline:single;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;&nbsp;</span></u><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">月</font></span><u><span style="mso-spacerun:'yes';font-family:仿宋;text-decoration:underline;text-underline:single;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;</span></u><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">日至</font></span><u><span style="mso-spacerun:'yes';font-family:仿宋;text-decoration:underline;text-underline:single;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;</span></u><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;<font face="仿宋">年</font></span><u><span style="mso-spacerun:'yes';font-family:仿宋;text-decoration:underline;text-underline:single;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;&nbsp;</span></u><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">月</font></span><u><span style="mso-spacerun:'yes';font-family:仿宋;text-decoration:underline;text-underline:single;font-size:11.0000pt;mso-font-kerning:1.0000pt;">&nbsp;</span></u><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">日止。</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">五、本协议项下停车场如遇市政修路、国家占地、甲方上级单位要求、政府物价部门对停车收费标准的调整等因素，甲乙双方同意在甲方提前三天告知乙方后终止本协议，乙方无权干涉，甲方不承担任何违约责任，并按乙方实际使用天数退还剩余停车费用。</font>&nbsp;</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">六、违约责任</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">1、若乙方未按本协议约定时间预交停车费，甲方有权拒绝乙方车辆在本协议项下停车场停放，乙方延迟支付停车费达三日，甲方有权利单方禁止乙方停放车辆。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;">2、乙方违反本协议约定任一条款，给甲方和/或第三方造成损失的，乙方应承担全部赔偿责任。</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">七、本协议履行过程中发生争议的，双方应友好协商解决，协商调解不成的，可向甲方所在地有管辖权的人民法院起诉。</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">八、本协议未尽事宜，由双方另行共同协商解决。</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">九、本协议一式叁份，甲方贰份，乙方壹份，具有同等法律效力。</font>&nbsp;</span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:38"><o:p></o:p></ins></span></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:38"><font face="仿宋">十、双方一致确认并同意，本合同可以采用数据电文为载体约定合同双方的权利义务内容，双方均可采用电子签名的形式签署本合同。根据本合同的约定进行签署的电子合同对双方均具有法律约束力，且与以其他方式签署的合同和文件具有同等法律效力。</font></ins></span></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:39"><font face="仿宋">本合同经双方加盖电子单位公章和</font>/或电子签名人名章（以下简称“电子签章”）后在平台以书面形式展现，加盖时间戳并经数字证书予以验证。本合同的生效之日以加盖时间戳或数字证书验证之日为准。双方需在合同签署前向对方提供用于签署本合同的电子签章并经对方确认和认可，双方根据本合同加盖的电子签章应与其在合同签署前向对方提供的且经确认和认可的电子签章保持一致。</ins></span></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><span class="msoIns"><ins cite="mailto:沈德凤（律师）" datetime="2021-06-17T12:39"><o:p></o:p></ins></span></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;text-align:left;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p>&nbsp;</o:p></span></p><p class="MsoNormal" style="text-indent:22.0000pt;mso-char-indent-count:2.0000;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><font face="仿宋">甲方（盖章）：</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font face="仿宋">乙方（签字）：</font></span><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p></o:p></span></p><p class="MsoNormal" style="line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:仿宋;font-size:11.0000pt;mso-font-kerning:1.0000pt;"><o:p>&nbsp;</o:p></span></p><p class="MsoNormal" style="text-indent:24.0000pt;mso-char-indent-count:2.0000;line-height:12.0000pt;mso-line-height-rule:exactly;"><span style="mso-spacerun:'yes';font-family:'Times New Roman';mso-fareast-font-family:宋体;font-size:12.0000pt;mso-font-kerning:1.0000pt;"><o:p>&nbsp;</o:p></span></p></div>
        <div class="agree-btn" @click="agreeShow=false">确定</div>
      </div>
    </div>


  </div>
</template>

<script>

import {createVipCardOrder, getOpenId, vxPayQuery} from '@/api/orderPay/orderPay'

export default {
  name: 'buyCard',
  data() {
    return {
      value: [],
      agreeShow: false,
      sessionData: {},
      agreeCheckbox: false,
      webAppCode: '', // 微信code
    }
  },
  mounted() {
    // this.$msgbox({
    //   title: '提示',
    //   message:
    //     '您为认证用户，当前还没有任何会员卡。购买会员卡享受更多停车优惠。' ,
    //   showCancelButton: true,
    //   confirmButtonText:'去购买',
    //   cancelButtonText: '放弃'
    // });
    this.sessionData = JSON.parse(sessionStorage.getItem('cardDetail'))
    console.log(this.sessionData)
    this.webAppCode = this.getCode();
  },
  methods: {
    getCode() {
      var appID = this.$utils.myVxAppId;
      var code = this.getUrlParam('code');
      var local = window.location.href;
      if (code == null || code === '') {
        window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appID + '&redirect_uri=' + encodeURIComponent(local) + '&response_type=code&scope=snsapi_base&state=1#wechat_redirect'
      } else {
        return code;
      }
    },
    getUrlParam(name) {
      var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
      var r = window.location.search.substr(1).match(reg)
      if (r != null) return unescape(r[2])
      return null
    },
    agreeShowHandle() {
      this.agreeShow = true
    },
    buyCardBtn() {
      console.log(this.agreeCheckbox)
      if (this.agreeCheckbox) {
        let jsondata = {
          payType: 4,//4：微信     1：支付宝    34:农行
          terminalSource: "3",//1:任你听 3：微信公共号 4:云平台 7:H5
          app_id: 1,
          salt: 2,
          deviceInfo: 3,
          sign_type: 'md5',
          sign: 4,
          token: '666',
          phoneNum: this.sessionData.phoneNum,
          plNo: this.sessionData.plNo,
          cardNo: this.sessionData.cardNo,
          carNumber: this.sessionData.carNumber,
          price: this.sessionData.price/100,
          num: this.sessionData.buyNum,
          discountAmount: this.sessionData.discountFee/100,
          totalAmount: this.sessionData.totalFee/100,
          optType: 1,
          cardType: this.sessionData.cardType,
          carType: this.sessionData.carType,
          effDate: this.sessionData.validStartTime,
          expDate: this.sessionData.validEndTime,
        }

        createVipCardOrder(jsondata).then(result => {
          console.log(result)
          if(result.code == 0){
            let me = this
            //第一步获取openid
            var codeParams = {
              code: this.webAppCode,
              appId: this.$utils.myVxAppId
            };
            getOpenId(codeParams).then(res => {
              if (res.code == 0) {
                me.vxPay(res.data, result.data.orderId)
              } else if (res.code == 40163) { //code been used, hints[重复code问题]
                // alert(res.message)
                this.$msgbox("提示", res.message);
                console.log(res.message);
              } else {
                this.$msgbox("提示", res.message);
              }
            })
          }else{
            this.$msgbox("提示", result.message);
          }
        })

      } else {
        this.$msgbox({
          title: '提示',
          message:
            '必须同意购买协议才可以购买！',
          showCancelButton: false,
        });
      }
    },
    vxPay(openIdData, orderIdData) {
      let vm = this
      var wxParams = {};
      wxParams.orderId = orderIdData;
      wxParams.backType = 2,
      wxParams.orgId = this.$utils.myOrgId,
      wxParams.payType = 4;// 1:支付宝 2：微信 3：银联 10:H5   4微信公众号
      wxParams.terminalSource = 7;//请求端来源 1： 任你停 2：pda 3：微信公共号 7:H5扫码 10页面支付
      wxParams.carNumber = this.carNumber;
      wxParams.paySrcType = 301;//301 充值
      // wxParams.recordArreaInfos = JSON.stringify(orderIdData);
      wxParams.openId = openIdData;
      wxParams.appId = this.$utils.myVxAppId;
      vxPayQuery(wxParams).then(res => {
        if (res.code == 0) { //
          if (res.data) {
            var data = res.data;
            console.log(JSON.stringify(data));
            if (typeof WeixinJSBridge === 'undefined') { // 微信浏览器内置对象。参考微信官方文档
              if (document.addEventListener) {
                document.addEventListener('WeixinJSBridgeReady', vm.onBridgeReady(data), false)
              } else if (document.attachEvent) {
                document.attachEvent('WeixinJSBridgeReady', vm.onBridgeReady(data))
                document.attachEvent('onWeixinJSBridgeReady', vm.onBridgeReady(data))
              }
            } else {
              console.log('准备调用微信支付')
              vm.onBridgeReady(data)
            }
          } else {
            alert("没有找到返回值");
          }
        } else {
          console.log(res.message);
          alert(res.message);
        }
      })
    },
    onBridgeReady(params) {
      let me = this
      console.log('调用微信支付WeixinJSBridge')
      WeixinJSBridge.invoke(
        'getBrandWCPayRequest', params,
        //
        // 'getBrandWCPayRequest', { // 下面参数内容都是后台返回的
        //   'appId': data.appId, // 公众号名称，由商户传入
        //   'timeStamp': data.timeStamp, // 时间戳
        //   'nonceStr': data.nonceStr, // 随机串
        //   'package': data.package, // 预支付id
        //   'signType': data.signType, // 微信签名方式
        //   'paySign': data.paySign // 微信签名
        // },
        function (res) {
          // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
          if (res.err_msg === 'get_brand_wcpay_request:ok') {
            console.log('成功')
            alert('支付成功')
            me.$router.go(-2);
          } else {
            console.log('失败')
            alert('支付失败')
            me.$router.go(-2);
          }
        }
      )
    },
  }
}
</script>

<style scoped lang="scss">
  > > > .mint-cell-wrapper {
    border-bottom: 1px solid #eee;
  }

  .submit-box {
    width: 100%;
    height: 44px;
    line-height: 44px;
    border-radius: 4px;
    font-size: 20px;
    margin-top: 18px;
    background: linear-gradient(180deg, #3885D9 0%, #4194EF 100%);
    color: #fff;
    text-align: center;
  }

  .agree-wrap {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, .5);
  }

  .agree-box {
    width: 85%;
    height: 85%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
  }

  .agree-main {
    padding: 10px;
    height: 94%;
    overflow-y: auto;
  }

  .agree-btn {
    height: 40px;
    line-height: 40px;
    color: #FFF;
    text-align: center;
    background: #3885D9;
    cursor: pointer;
  }


</style>
